<!DOCTYPE html>
<html>
	<head>
		<!-- 字符编码 -->
		<meta charset="utf-8">
		<!-- 定义适配移动端屏幕比例代码 -->
		<meta name="viewport"
			content="width=device-width,user-scalable=no,inital-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/style.css"/>
	</head>
	<body>
		<div class="header">
			<div class="header-f">
				<div class="logo">
					<img src="images/logo.png" >
				</div> 
				<div class="nav">
					<ul>
						<li>
							<a style="color: #FF0000;" href="login.html">登录注册</a>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div class="login">
			<div class="login-f"> 
				<h3>欢迎登陆</h3>
				<div class="login-box">
					<input type="text" placeholder="请输入账号" class="zhang"/>
					<input type="text" placeholder="请输入密码" class="mima"/>
				</div>
				<button type="button" class="OK">登陆</button>
				<p>没有账号，<a href="res.html">点击注册</a></p>
			</div>
		</div>
		<div class="footer">
			<p>姓名:黎训斌 学号:0223610 班级:软件11班</p>
			<p>报告：亮点 移动端通用 轮播图  鼠标指示放大效果 </p>
		</div>
		<script type="text/javascript">
			window.onload=function(){
				let ok = document.querySelector('.OK');
				ok.onclick=function(){
					let zhang = document.querySelector('.zhang').value;
					let mima = document.querySelector('.mima').value;
					if(zhang=='' || mima==''){
						alert('文本框不能为空');
						return;
					}
					if(zhang !='nn' || mima !='1234'){
						alert('账号密码输入错误！');
						return 
					}
					alert('登入成功！');
					location.href='index.html';
				}
			}
		</script>
	</body>
</html>